// 混入
import { debounce } from './tools'
import { BACKTOP_DISTANCE } from './const'
import BackTop from 'components/content/BackTop/BackTop.vue'

// TODO: bus事件监听的混入
export const itemListMixin = {
  data () {
    return {
      // $bus的事件处理程序
      itemImglistener: null
    }
  },
  mounted () {
    // 使用防抖函数进行优化
    const refresh = debounce(this.$refs.betterScroll.refresh, 200)

    this.itemImglistener = () => {
      // debounce返回一个函数, 在这里执行
      refresh()
    }

    // 开启事件总线监听
    this.$bus.$on('itemImgLoad', this.itemImglistener)
  }
}

// TODO: backTop返回顶部按钮的混入
export const backTopMixin = {
  components: {
    BackTop
  },
  data () {
    return {
      isBackTopShow: false
    }
  },
  methods: {
    backHandler () {
      // 返回了顶部(通过refs用scroll组件中的bs实例, 调用scrollTo方法)
      // this.$refs.betterScroll.bs.scrollTo(0, 0, 1000)

      // 直接在scroll组件中封装好回到顶部方法,让我们调用就行
      this.$refs.betterScroll.scrollTo(0, 0)
    },
    // 返回顶部按钮
    showBackTopBtn (positionY) {
      this.isBackTopShow = positionY >= BACKTOP_DISTANCE
    }
  }
}
